#{extends 'organization.html' /}
<div class="viewContent">
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>

<link rel="stylesheet" type="text/css" href="@{'/public/stylesheets/jquery.autocomplete.css'}" />
<script type="text/javascript" src="@{'/public/javascripts/jquery.autocomplete.js'}"></script>

<script>
  $(document).ready(function(){
    var data =  "${tags}".split(", ")
    data[0] = data[0].substring(1,data[0].length)
    data[data.length-1] = data[data.length-1].substring(0,data[data.length-1].length-1)
  $("#input${ideaID}").autocomplete(data);
  });
  </script>

<script type="text/javascript">

	
	function doTag(ideaID,name) {

		//document.getElementById("form"+tagID).style.visibility = 'hidden';
		var newName = document.getElementById("input"+ideaID).value;
		
		
		//try{
		$.ajax({
			 	type: "GET",
			 	url: "/topiccontroller/tagidea",
			 	dataType: "html",
			 	data: "ideaID="+ideaID+"&name="+newName,
			 	success: function(html){
			 	$("#currentTags").replaceWith($("#currentTags", html));
		     	}
		 	  });
		//}catch (e) {
			//console.log (e.message);
		//}
	
	   
}
</script>

<h3>tag an idea</h3>



<div id="form${ideaID}">
		<br/>
		<form id="members" action = "javascript:doTag(${ideaID});" method="post" >
			<input type="text" name="newName"
				id="input${ideaID}"/>
			<input type="submit" value="Add tag"/>

		</form>
	</div>

</form>
<div id="currentTags">
#{if triedToCreate}
        <label style="font-size:12px;color:RED">sorry you are not allowed to create a new tag, please select one of the existing tags
        </label>
#{/if}
<p> Current Tags : </p></br>
#{list items:allTags, as:'tag'}
<div class = "Tag">
<span class = "name">
${tag.name}
<form action="@{TopicController.removeTagIdea()}">
<p>
	<input type="hidden" name="ideaID" value="${ideaID}" />
	<input type="hidden" name="tagID" value="${tag.id}" />
	<input type="submit" value="remove tag"/>
</p>
</form>
</span>
</div>
#{/list}
</div>
</div>

</br></br>
<a class="standardLink" style="font:16px/26px Georgia, Garamond, Serif;"href = "@{Browse.viewIdea(ideaID)}">
done tagging
</a>
